<template>
	<el-row class="row-layout">
		<slot></slot>
	</el-row>
</template>

<script>
import { ref } from 'vue'
import yunApi from 'static/js/toolApi.js'
export default {
    name: 'Row',
	props: {
		item: {
			type: Object,
			default: function() {
				return {}
			}
		}
	},
	emits: ['update:item'],
	setup() {
		const dataAttr = ref({})
		return {
			dataAttr
		}
	},
	watch: {
		// 监听父组件数据，创建副本
		item: {
			handler(v) {
				this.dataAttr.itemCopy = JSON.parse(JSON.stringify(v))
			},
			deep: true,
			immediate: true
		},
		// 监听属性变化，然后重新修改组件的属性
		'dataAttr.itemCopy.attribute': {
			handler(v) {
				this.init()
			},
			deep: true
		},
		// 监听item复制对象，然后v-model修改父组件数据
		'dataAttr.itemCopy': {
			handler(v) {
				this.$emit('update:item', v)
			},
			deep: true
		},
	},
	methods: {
		init() {
	
		}
	},
	created() {
		this.init()
	}
}
</script>

<style scoped lang="less">
	.fixed-layout {
		position: absolute;
		top: 0;
		left: 0;
		width: auto;
	}
</style>
